import React from 'react';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import {createStackNavigator, createBottomTabNavigator} from 'react-navigation';
import GankTodayScreen from "../../../src/biz/today/GankTodayScreen";
import ProfileScreen from "../../../src/biz/user/ProfileScreen";
import LoginScreen from "../../../src/biz/user/login/LoginScreen";
import WebViewScreen from "../../../src/biz/common/WebViewScreen";
import WelcomePage from "../../../src/biz/common/WelcomePage";


const TabConfig = {
    Home: {
        screen: GankTodayScreen,
        navigationOptions: {
            tabBarLabel: '主页',
            tabBarIcon: ({focused}) => (
                <Icon name={'home'} size={24} color={focused ? '#4ca5ff' : '#888'}/>
            )
        }
    },
    Profile: {
        screen: ProfileScreen,
        navigationOptions: {
            tabBarLabel: '设置',
            tabBarIcon: ({focused}) => (
                <Icon name={'settings'} size={24} color={focused ? '#4ca5ff' : '#888'}/>
            )
        }
    }
}
const Main = createBottomTabNavigator(
    TabConfig
    , {
        tabBarOptions: {
            activeTintColor: '#4ca5ff',
            inactiveTintColor: '#888888'
        }
    });
Main.navigationOptions = ({navigation}) => {
    console.log("navigation :", navigation);
    const {routeName} = navigation.state.routes[navigation.state.index];
    return {
        headerTitle: TabConfig[routeName].navigationOptions.tabBarLabel
    }
};
export const AppNavigator = createStackNavigator({
        Welcome: {
            screen: WelcomePage,
        },
        Login: {
            screen: LoginScreen,
        },
        Main: {
            screen: Main
        },
        Detail: {
            screen: WebViewScreen
        }
    }, {
        navigationOptions: {
            headerBackTitle: null,
            headerTintColor: 'white',
            headerStyle: {backgroundColor: '#4ca5ff'},
            headerTitleStyle: {fontSize: 18, fontWeight: 'bold'},
            showIcon: true,
        },
        headerMode: 'screen'
    }
);

